Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Connect frontend with user service #47

Merged
merged 33 commits into from
Oct 17, 2024
Merged

Conversation

LimZiJia
Copy link

Helpers Added

JWT Interceptor

  • All queries to user service endpoints will be intercepted and an "Authorization" header will be inserted if user is already logged in
  • It subscribes to the Observable user$, which is linked to BehaviorSubject which is updated whenever user login or logout.

Error Interceptor

  • Force user logout if receive 401 or 403 status codes.

Services added

Auth Guard service

  • Guards routes that we only want regular users to access
  • Possible to add more guards such as one for Admin users, but not implemented yet

Authentication Service

  • Handles login, logout, create account
  • Interacts with user service endpoints
  • userSubject is an BehaviorSubject updated by login() and logout()
  • userSubject should remain private because it represents the current state of user. Other services/components should not be able to interact with this!!!
  • user$ is an Observerble for userSubject so it is also the updated state

Components modified

Login component and Register component

  • Removed placeholder codes to replace with actual functionality

Other changes

app.config.js

  • Added auth guard and interceptors

Routes

  • Added auth guard service to guard '/questions'

Checklist

  • I have updated documentation
  • All tests passing

Resolves #46, resolves #12

samuelim01 and others added 21 commits September 27, 2024 20:19
Got user service to work in docker. It can only interface with an atlas cloud server currently.
User-service in docker can only communicate with an atlas mongodb server.
Some files should have been committed in the previous commit. They are
mostly to do with the dockerisation process. The merge with main might
have messed with it.
Somehow .gitignore was not commited with the last commit
Apparently bcrypt library cannot run on Docker's architecture. Change
bcrypt to bcryptjs for compatibility.
Test does not currently work
Not connected to the login interface yet. Commiting to make a clean Pr.
* Remove orphan history file
* Move `index.js` and `server.js` to the correct directory
* Reduce use of port
Frontend is now able to POST to user login endpoint and receive a JWT
token and some user details. These are stored in localStorage.
Some new files were untracked.
Right now if register is successful, it will auto login.

Login if successful will bring users to the '/' directory.

If user is already logged in, attemptes to reach '/account' will be
immediately redirected to '/'
To keep it consistent with main, I have renamed files that are not part
of app from filename to "_filename" out of app. I also cleaned up the
outdated user-service because it was renamed already.
There was a duplicated of "user" in compose.yml.
Used ng generate guard to generate these.
Removed those _guards and implemented as a service instead. Added a
guard to '/questions' so only logged in users with tokens that have not
expired can access it. If they are not logged in, users will be directed
to '/login' to log in.
Was magically missing from last commit.
- Removed user network (errornous merging).
- Removed duplicate providers
Added interface for user service response.
Copy link

@samuelim01 samuelim01 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good, with this PR we can start blocking off access to pages on the frontend and protecting our backend. Just need to fix a few nits

frontend/src/_environments/environment.ts Outdated Show resolved Hide resolved
frontend/src/_helpers/interceptors/jwt.interceptor.ts Outdated Show resolved Hide resolved
frontend/src/_helpers/interceptors/jwt.interceptor.spec.ts Outdated Show resolved Hide resolved
frontend/src/_models/user.model.ts Outdated Show resolved Hide resolved
frontend/src/_models/user.service.response.interface.ts Outdated Show resolved Hide resolved
frontend/src/_services/authentication.service.ts Outdated Show resolved Hide resolved
frontend/src/_services/authentication.service.ts Outdated Show resolved Hide resolved
frontend/src/_services/authentication.service.ts Outdated Show resolved Hide resolved
frontend/src/app/account/login.component.ts Outdated Show resolved Hide resolved
Trying to figure out how to get status code from HttpClient with
HttpResponse.
Realised that the error interceptor was mishandling the errors. Now it
will throw an Error object with properties .message and .cause. Where
message is the original error.message, and cause is just the original
error itself.
* Move interceptors into _interceptors
* Clean user and user service response models
* Fix auth service unhandled cases
* Minor phrasing fixes
@McNaBry McNaBry self-requested a review October 17, 2024 07:42
Copy link

@McNaBry McNaBry left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@McNaBry McNaBry merged commit fa522fd into main Oct 17, 2024
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Connect user service with frontend Containerize User Service
3 participants